<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title>绑定设备</title>
    <meta name="keywords" content="">
    <meta name="description" content="">
    <meta name="renderer" content="webkit">
    <meta http-equiv="Cache-Control" content="no-siteapp" />
    <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1" />
    <meta name="apple-mobile-web-app-capable" content="yes" />
    <meta name="apple-mobile-web-app-status-bar-style" content="black" />
    <meta name="format-detection" content="telephone=no" />
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, minimum-
scale=1, user-scalable=no">
    <link rel="stylesheet" type="text/css" href="../css/mobiscroll.custom-3.0.0-beta6.min.css" />
    <link rel="stylesheet" type="text/css" href="../css/common.css" />
    <link rel="stylesheet" type="text/css" href="../css/y_index.css" />
    <style>
    ..mbsc-mobiscroll a {
        color: #999;
    }
    </style>
</head>

<body>
    <div class="bigBox">
        <div class="container">
            <ul class="bw">
                <li class="bdb p30">设备类型：纸巾机</li>
                <li class="bdb p30">设备编号：562354523</li>
                <li class="bdb p30">设备单价：￥10.00</li>
                <li class="bdb p30">设备IMEI：￥26.00</li>
            </ul>
            <p class="p30 col9">其他信息</p>
            <ul class="bw">
                <li class="bdb p30 flex_sb">设备地址
                    <input class="tae" type="text" placeholder="请输入" />
                </li>
                <li class="bdb p30 flex_sb">设备库存
                    <input class="tae" type="text" placeholder="请输入" />
                </li>
                <li class="bdb p30 flex_sb">代理人
                    <div class="flex_a" id="agent">
                        <span class="agentRes">请选择</span>
                        <img class="ml20" src="../img/y_arrow_right.png" style="width: .12rem;height: .22rem;" />
                    </div>
                </li>
                <li class="bdb p30 flex_sb">运维人员
                    <div class="flex_a">
                        <span>请选择</span>
                        <img class="ml20" src="../img/y_arrow_right.png" style="width: .12rem;height: .22rem;" />
                    </div>
                </li>
                <li class="bdb p30 flex_sb">运维热线
                    <input class="tae" type="text" placeholder="请输入" />
                </li>
            </ul>
            <div class="main_btn tap">绑定设备</div>
        </div>
    </div>
</body>

</html>
<script src="../js/jquery-1.8.3.min.js" type="text/javascript" charset="utf-8"></script>
<script src="../js/dlc.js" type="text/javascript" charset="utf-8"></script>
<script src="../js/swiper.min.js" type="text/javascript" charset="utf-8"></script>
<script src="../js/mobiscroll.jquery.min.js" type="text/javascript" charset="utf-8"></script>
<!--公司的常用函数封装-->
<script type="text/javascript">
// create a number scroller
var timeed = ['一星级', '二星级', '三星级', '四星级', '五星级'];
$('#agent').mobiscroll().scroller({
    theme: 'mobiscroll',
    display: 'bottom',
    showLabel: true,
    cancelText: '',
    height: 35,
    width: 130,
    rows: 5,
    setText: '',
    lang: 'zh',
    closeOnOverlayTap: true, //点击遮罩无效
    showLabel: true,
    circular: [false, false],
    onBeforeClose: function(event, inst) {
        if (event.button == 'set') {
            console.log(event.valueText);
            $('.agentRes').text(event.valueText)
        }
    },

    headerText: function(valueText) {
        return "<div class='headerText flex flex_sb'><a class='l' onclick='cancel()'>取消</ a><a class='r c_diy' onclick='confirm();'>确定</a></div><div class='notnotice'></div>";
    },

    wheels: [
        [{
            label: '请选择',
            data: timeed
        }]
    ]
});

function cancel() {
    $('#agent').mobiscroll('cancel');
}

function confirm() {
    $('#agent').mobiscroll('select');
}
</script>